const path = require('path');
var CopyPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CspHtmlWebpackPlugin = require('csp-html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');



module.exports = {
    entry: './src/lib/index.ts',
    devtool: 'source-map',//'inline-source-map',
    mode: 'development', // 设置mode
    module: {
        // unknownContextCritical : false,
        rules: [
            {
                test: /\.ts?$/,
                use: 'ts-loader',
                exclude: /node_modules/
            }
            , {
                parser: { amd: false }
            },
            {
                test: /\.css$/,
                use: [
                    'style-loader',
                    'css-loader'
                ]
            },
            {
                test: /\.less$/,
                use: [
                    'style-loader',
                    // {
                    //     loader: MiniCssExtractPlugin.loader,
                    //     // options: { injectType: 'linkTag' }
                    // },
                    'css-loader',
                    'less-loader'
                ]
            },
            // {
            //     test: /\.(png|svg|jpg|gif)$/,
            //     use: {
            //         loader: 'file-loader',
            //         options: {
            //             name: 'assets/[name].[ext]',
            //         }
            //     }
            // }, 
            {
                test: /\.(png|svg|jpg|gif)$/,
                use: {
                    loader: 'url-loader',
                    options: {
                        name: 'assets/[name].[ext]',
                        limit: 2048
                    }
                }
            },
        ]
    },
    resolve: {
        extensions: ['.ts', '.js']
    },
    output: {
        filename: 'monitor-charts.js',
        path: path.resolve(__dirname, 'dist'),
        libraryTarget: 'umd',
        umdNamedDefine: true
        //libraryExport: "default",
        , library: "MonitorCharts"   //不要设置libraryName就行了
    },
    devServer: {
        //contentBase: path.join(__dirname, "dist"),
        contentBase: path.join(__dirname, 'src'),
        port: 7000,
        // publicPath:'/',
        // overlay: true,
        host: '127.0.0.1',
        progress: true
    },
    plugins: [
        // new MiniCssExtractPlugin({
        //     filename: 'monitor-charts.css',
        //     chunkFilename: '[id].css',
        //     insert: function () {
        //         console.log(111112112312312312312131211);
        //     }
        // }),
        // new HtmlWebpackPlugin(),
        // // new CspHtmlWebpackPlugin({
        // //     'script-src': '',
        // //     'style-src': ''
        // // }),
        new CopyPlugin(// 复制插件
            {
                patterns: [{
                    from: path.join(__dirname, 'src/assets'),
                    to: path.join(__dirname, 'dist/assets')
                }]
            }
        )
    ]
};


// "@types/echarts": "^4.9.6",
// "copy-webpack-plugin": "^7.0.0",
// "ts-loader": "^8.0.17",
// "typescript": "^4.2.3",
// "webpack": "^4.46.0",
// "webpack-cli": "^3.3.12",
// "webpack-dev-server": "^3.11.2"